<!DOCTYPE html>
<html>
<head lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<meta content="telephone=no" name="format-detection">
<meta name="description" content="">
<meta name="keywords" content="">
<title>海风商城</title>
<link rel="stylesheet" href="/css/base.css"/>
<link rel="stylesheet" href="/css/index.css"/>
<link rel="shortcut icon" href="favicon.ico" />
{insert_scripts files="../../js/jquery-1.12.3.min.js"}
{insert_scripts files="../../js/zepto.min.js"}
{insert_scripts files="../../js/swiper.min.js"}
<script>
   !function(){
            var htmlEl = document.getElementsByTagName('html')[0];
            var fitPage = function(){
                /* The calculate of with from zepto  */
                var w = htmlEl.getBoundingClientRect().width;
                w = Math.round(w);
                w = w > 640 ? 640: w;
                var newW = w/640 * 100;
                htmlEl.style.fontSize = newW + 'px';
            }
            fitPage();

            var t;
            var func = function(){
                clearTimeout(t);
                t = setTimeout(fitPage, 25);
            }
            window.addEventListener('resize', func);
        }();
</script>
</head>
<body>

<!--banner Start-->
<div class="wrapper">
  <div class="page-index">
    <!--header Start-->
    <div class="header index-header">
      <div class="left fl">
        <a onclick="history.go(-1)" class="home">
        <img src="/images/hf/logo.png" class="logo"></a>
      </div>
      <div class="tit">
        <h2><span class="title"></span></h2>
      </div>
      <div class="right fr">
      <!-- {if ($username) } -->
      {$username}, <a href="/mobile/user.php?act=logout">退出</a>
      <!-- {else} -->
      <a class="lg">登录</a>
      <!-- {/if} -->
      </div>
    </div>
    <!--header End  -->
    <div id="slider" class="slider">
    <div class="swiper-wrapper">
      <div class="swiper-slide swiper-slide-duplicate">
        <img  src="/images/hf/banner04.jpg" alt="金榜题名 2015年海风学院自主招生录取榜" title="金榜题名 2015年海风学院自主招生录取榜">
        <a href="http://www10.53kf.com/webCompany.php?arg=10069074&style=1&keyword=&kf=  " class="bannerBtn" target="_blank"></a>
      </div>
      <div class="swiper-slide" >
        <img  src="/images/hf/banner1.jpg" alt="金榜题名 2015年海风学院自主招生录取榜" title="金榜题名 2015年海风学院自主招生录取榜">
        <a  href="http://vip.hfjy.com/newtpl/zzhb-m.html" class="bannerBtn" target="_blank"></a>
      </div>
      <div class="swiper-slide " >
         <img   src="/images/hf/banner3.jpg" alt="在线补习1对1 高效当然高分 中学生一站式学习平台" title="在线补习1对1 高效当然高分 中学生一站式学习平台">
         <a href="http://mp.weixin.qq.com/bizmall/mallshelf?id=&t=mall/list&biz=MjM5MDkzODEyMA==&shelf_id=7&showwxpaytitle=1#wechat_redirect " class="bannerBtn" target="_blank"></a>
      </div>
</div>
     
      <div class="swiper-pagination">
      </div>
    </div>
    <!-- Initialize Swiper -->
    <script>
    var swiper = new Swiper('.slider', {
        pagination: '.swiper-pagination',
        paginationClickable: true,
        centeredSlides: true,
        autoplay:5000,
        autoplayDisableOnInteraction: false
    });
  </script>
    <!--banner End  -->
    <!--全方位为您服务 Start -->
    <div class="mcells_auto_fill">
      <div class="list">
        <ul class="floor-item">
          <li class="marleft-first"><a href="/mobile/goods.php?cat=0"><img src="/images/hf/chuzhong.jpg" alt=""/></a></li>
          <li><a href="/mobile/goods.php?cat=1"><img src="/images/hf/gaozhong.jpg" alt=""/></a></li>
          <li><a href="/mobile/goods.php?cat=2"><img src="/images/hf/shengxue.jpg" alt=""/></a></li>
        </ul>
      </div>
    </div>
    <!--全方位为您服务 End -->
    <div class="section">
      <div class="version">
        <div class="version-item">
          <!--专注名校升学 Start -->
          <h2 class="title">专注名校升学</h2>
          <div class="version-img">
            <img src="/images/hf/zhuanzhu.jpg" alt="" title="">
          </div>
          <!--专注名校升学 End -->
          <!--重塑行业标准 Start -->
          <h2 class="title">重塑行业标准</h2>
          <div class="version-img">
            <img src="/images/hf/hangye.jpg" alt="" title="">
          </div>
          <!--重塑行业标准 End -->
          <!--深受学生喜爱的 Start -->
          <h2 class="title">深受学生喜爱的</h2>
          <div class="version-img">
            <img src="/images/hf/live.jpg" alt="" title="">
          </div>
          <!--深受学生喜爱的 End -->
        </div>
      </div>
    </div>
    <footer class="footer">
    <ul>
      <li><a href="http://m.hfjy.com/teachers.html">海风师资</a></li>
      <li><a href="http://m.hfjy.com/research.html">海风教研</a></li>
      <li><a href="http://m.hfjy.com/Online.html">学习中心</a></li>
      <li><a href="http://m.hfjy.com/cooperation.html">商务合作</a></li>
      <li><a href="http://m.hfjy.com/joinUs.html">加入我们</a></li>
    </ul>
    <p class="copyright ">
      © 2010-2016 hfjy.com All Rights Reserved. 沪ICP备11030714号-1
    </p>
    </footer>
  </div>
</div>
{include file="/public.html"}
<!-- 侧边栏 -->
<div class="sideBar">
  <ul class="sideBar-ul">
      <li class="helper"><a>选课小助手</a></li>
      <li class="online-ask"><a href="http://www10.53kf.com/webCompany.php?arg=10069074&style=1&keyword=&kf=" target="_blank" onclick="this.style.color='white';">在线咨询</a></li>
  </ul>
</div>
<!-- 弹框1 Start-->
<div class="class-dialog" id="">
  <div class="mask">
  </div>
  <div class="share-center">
    <div class="popTitle">
     <img src="/images/hf/tast.png" height="" width="" alt="" class="tast-img" />
      <span class="title padding-13">给我一分钟，找到最合适您的课程 </span>
      <i class="iconfont close">&#xe600;</i>
    </div>
    <div class="login-box clearfix padd20">
      <p class="class-tit">年级</p>
      <ul class="class-list in_class">
        <li class=" curr marleft-first">高三<b></b></li>
        <li class="">高二<b></b></li>
        <li class="">高一<b></b></li>
        <li class="marleft-first">初三<b></b></li>
        <li class="">初二<b></b></li>
        <li class="">初一<b></b></li>
        <li class="marleft-first">小学/预备班<b></b></li>
      </ul>
      <p class="class-tit clearfix ">年级排名</p>
       <ul class="class-list in_rank">
        <li class=" curr marleft-first">名列前茅<b></b></li>
        <li class="">中游<b></b></li>
        <li class="">需努力<b></b></li>
       
      </ul>
      <div class="class-btn">
          <button class="hf-btn btn-bule dialog_next">下一步</button>
      </div>
    
    </div>
  </div>
</div>
<!--弹框1 Start-->
<!-- 弹框2 Start-->
<script type="text/javascript">
  Zepto(function($){

        function preventDefault(e) {
            e = e || window.event;
            e.preventDefault && e.preventDefault();
            e.returnValue = false;
        }

        function stopPropagation(e){
      e = e || window.event;
      e.stopPropagation && e.stopPropagation();
      e.cancelBubble = false;
        }

        function innerScroll(e){
          // 阻止冒泡到document
          // document上已经preventDefault
          stopPropagation(e);

      var delta = e.wheelDelta || e.detail || 0;
      var box = $(this).get(0);

      if($(box).height() + box.scrollTop >= box.scrollHeight){
        if(delta < 0) {
          preventDefault(e);
          return false;
        }
      }
      if(box.scrollTop === 0){
        if(delta > 0) {
          preventDefault(e);
          return false;
        }
      }
      // 会阻止原生滚动
      // return false;
        }

    var disableScroll = function(){
      $(document).on('mousewheel', preventDefault);
      $(document).on('touchmove', preventDefault);
    };

    var enableScroll = function(){
      $(document).off('mousewheel', preventDefault);
      $(document).off('touchmove', preventDefault);
    };
    // bind
    $(".lg").on("click",function(e){
      $('.login').show();
       // enableScroll();
             
    });
    
    
    // 内部可滚
    $('.login, .register, .resetpwd, .class-dialog, .course-ad ').on('mousewheel', innerScroll);
    // 外部禁用
    // disableScroll();


    // 移动端touch重写
    var startX, startY;
    $('.login, .register, .resetpwd, .class-dialog, .course-ad ').on('touchstart', function(e){
      startX = e.changedTouches[0].pageX;
      startY = e.changedTouches[0].pageY;
    });

    // 仿innerScroll方法
    $('.login, .register, .resetpwd, .class-dialog, .course-ad ').on('touchmove', function(e){
      e.stopPropagation();

      var deltaX = e.changedTouches[0].pageX - startX;
      var deltaY = e.changedTouches[0].pageY - startY;

      // 只能纵向滚
      if(Math.abs(deltaY) < Math.abs(deltaX)){
        e.preventDefault();
        return false;
      }

      var box = $(this).get(0);

      if($(box).height() + box.scrollTop >= box.scrollHeight){
        if(deltaY < 0) {
          e.preventDefault();
          return false;
        }
      }
      if(box.scrollTop === 0){
        if(deltaY > 0) {
          e.preventDefault();
          return false;
        }
      }
      // 会阻止原生滚动
      // return false;
    });

  });
  </script>
<script type="text/javascript">

        var  _is=false;
        var  _class = "高三";
        var  _rank  = "名列前茅";
        var is_show = window.localStorage.is_show;

        $(function(){
            
            $('.helper').click(function(){
                window.localStorage.is_show = 1;
                $('.class-dialog').show();
            })

            $('.in_class > li').click(function(){
                window.localStorage.is_show = 1;
                _class = $(this).text();
                $(this).addClass("curr").siblings().removeClass("curr");
            })

            $('.in_rank > li').click(function(){
                window.localStorage.is_show = 1;
                _rank = $(this).text();
                $(this).addClass("curr").siblings().removeClass("curr");
            })
            
            $('body').click(function(){
                is_show = 1;
                window.localStorage.is_show = 1;
            })

            setTimeout(function () {
              if( is_show ) return false;
              else shouDialog();
            }, 5000);

            $('.dialog_next').on('click', getGroom);
        })
        

        function shouDialog(){
            $('.class-dialog').show(); 
            window.localStorage.is_show = 1;
        }
        
        function getGroom(){
            $('.class-dialog').hide();
            $('.course-ad').show();
            if(_is==false){
              var swiper = new Swiper('.swiper-container', {
                  pagination: '.swiper-pagination',
                  slidesPerView: 'auto',
                  paginationClickable: true,
                  spaceBetween: 0
              });
              _is =true;
            }
              
            $.post('/goods.php?act=helper', {'grade':_class,'rank':_rank,'mobile':1}, function(data){
              //console.info(data);
                  if( data.status == 'ok' ){
                      var data_info =  data.data;
                      var $html = '<div class="swiper-slide"><ul class="course-list">';
                      for(var i in data_info ){
                        console.info(i);
                          if( i%2 == 0 && i!= 0) $html = $html +'</ul></div><div class="swiper-slide"><ul class="course-list">';

                          $html = $html + '<li ><em></em><h3>'+data_info[i]['title']+'</h3><p>'+data_info[i]['brief']+'</p><a href="/mobile/'+data_info[i]['url']+'">查看详情</a></li>';
                      }
                      //console.info(data_info.length);
                      $('.helper-content').html($html);
                  }
            },'json')
        }
</script>
<!--弹框1 Start-->
  <div class="course-ad">
      <div class="mask">
      </div>
      <div class="popTitle">
         <img src="/images/hf/tast.png" height="" width="" alt="" class="tast-img" />
          <span class="title padding-13">通过您的情况，我们提供以下精品课程 </span>
          <i class="iconfont close">&#xe600;</i>
      </div>  
      <div class="course-box clearfix ">

        <div class="swiper-container " id="">
          <div class="swiper-wrapper helper-content">

          </div>
          <!-- Add Pagination -->
          <div class="swiper-pagination"></div>
        </div>
      </div>
  </div>

</body>
</html>